<template >
  <div style="padding:10px">
    <Form ref="form" :model="form" :rules="rules">
      <FormItem label="标题" prop="title.zh">
        <Input v-model="form.title.zh" placeholder="输入标题" style="width:400px"></Input>
      </FormItem>
      <FormItem label="附件" prop="file">
        <Upload
          :action="upload_url"
          name="file"
          ref="upload"
          :default-file-list="defaultList"
          :headers="headers"
          :on-success="upSuccess"
          :on-remove="RemoveFile"
          :before-upload="handleBeforeUpload"
        >
          <Button type="ghost" icon="ios-cloud-upload-outline">上传附件</Button>
        </Upload>
      </FormItem>
      <FormItem style="margin-bottom:23px" prop="content.zh">
        <p style="margin-bottom:10px">内容：</p>
        <orh-editor v-model="form.content.zh" :module="modelName"></orh-editor>
      </FormItem>
      <FormItem align="center">
        <Button
          type="primary"
          @click="submit('form')"
          long
          :loading="load"
        >{{ num ==1 ? "添加" : num ==2 ?"修改" : "" }}</Button>
      </FormItem>
    </Form>
  </div>
</template>
<script>
const OrhEditor = () =>
  import("~/components/Public/OrhEditor").then(m => m.default || m);
export default {
  components: {
    OrhEditor
  },
  props: {
    num: {
      type: Number,
      default: null
    },
    dataId: {
      type: Number,
      default: null
    }
  },
  data() {
    return {
      file_id: null,
      load: false,
      defaultList: [],
      AddUrl: "api/filing/v1/file/add",
      modelName: "Watchlist",
      upload_url: this.$project.axios.baseUrl + "api/user/v1/upload",
      headers: {
        Authorization:
          "Bearer " + (localStorage[this.$project.axios.Authorization] || "")
      },
      form: {
        file_type: 553,
        file: [], //部门id
        title: {
          zh: "",
          en: "",
          mn: ""
        },
        content: {
          zh: "",
          en: "",
          mn: ""
        },
        file_name: {
          zh: "",
          en: "",
          mn: ""
        }
      },
      rules: {
        "title.zh": [
          { required: true, message: "标题不能为空", trigger: "blur" }
        ],
        "content.zh": [
          { required: true, message: "内容不能为空", trigger: "blur" }
        ]
      }
    };
  },
  methods: {
    Add() {
      this.$http
        .post(this.AddUrl, this.form)
        .then(val => {
          this.$emit("close", true);
          this.load = false;
          this.$Message.success("添加成功");
        })
        .catch(err => {
          this.load = false;
          if (err.code && err.code == 422) {
            this.$Message.error(err.message);
          }
        });
    },
    Edit() {
      this.$http
        .put("api/filing/v1/file/update/" + this.file_id, this.form)
        .then(val => {
          this.$emit("close", true);
          this.load = false;
          this.$Message.success("修改成功");
        })
        .catch(err => {
          this.load = false;
          if (err.code && err.code == 422) {
            this.$Message.error(err.message);
          }
        });
    },
    submit(name) {
      this.$refs[name].validate(valid => {
        if (valid) {
          this.load = true;
          if (this.num == 1) {
            this.Add();
          } else if (this.num == 2) {
            this.Edit();
          }
        } else {
          this.$Message.error("您输入的信息有误，请检查");
        }
      });
    },
    //附件上传成功
    upSuccess(res, file) {
      this.form.file.push(res.data.id);
      this.form.file_name.zh = res.data.name;
    },
    RemoveFile(file, fileList) {
      this.form.file.splice(0, 1);
    },
    handleBeforeUpload(file) {
      if (this.form.file.length == 1) {
        this.$Message.info("最多上传一个附件");
        return false;
      }
    },
    getone() {
      this.$http
        .get("api/filing/v1/file/getone/" + this.dataId)
        .then(val => {
          this.defaultList = [];
          this.form.file_name.zh = val.data.file_name;
          this.form.title = val.data.title;
          this.form.content = val.data.content;
          this.file_id = val.data.file_id;
          if (val.data.upload_file) {
            this.defaultList.push({
              name: val.data.file_name.zh,
              url: val.data.upload_file
            });
            this.form.file.push(val.data.file_id);
          }
        })
        .catch(err => {
          if (err.code && err.code == 422) {
            this.$Message.error(err.message);
          }
        });
    },
    close() {
      this.$emit("close", true);
    }
  },
  mounted() {
    if (this.num == 2) {
      this.getone();
    }
  }
};
</script>
